<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<head>
    <title th:text="${session.title}"></title>
    <link th:replace="common/header" />
    <script type="text/javascript">
        function reloadVerifyCode(obj){
            obj.src = "/verifyCode?" + Math.random();
        }

        $(document).ready(function(){
            reloadVerifyCode($("#yzmImage")[0]);
            $.ajax({
                type: "POST",
                dataType: "text",
                url: "/getcookie",
                success: function(data){
                    if(data !== "error"){
                        var result = data.split(",");
                        $('#name').val(result[0]);
                        $('#password').val(result[1]);
                        $('#rememberme').attr("checked",'true');
                    }else{
                        $('#rememberme').removeAttr("checked");
                    }
                }
            });
        });

        document.onkeydown=function(event){
            e = event ? event :(window.event ? window.event : null);
            if(e.keyCode === 13){
                document.getElementById("login_btn").click();  //调用登录按钮的登录事件
            }
        }
    </script>
    <style>
        html,body{height:100%;}
        input:-webkit-autofill {
            -webkit-animation: autofill-fix 1s infinite;
        }

        @-webkit-keyframes autofill-fix {
            from {
                background-color: transparent
            }
            to {
                background-color: transparent
            }
        }
    </style>
    <script th:src="@{/js/swfobject_modified.js}" type="text/javascript"></script>
</head>
<body>
<div class="login_div">
    <div class="login_message" style="display: none;">
        <div class="login_word">
            <div class="login_tip">
                <img th:src="@{/images/loading.gif}" src="" alt="" /> 正在登陆，请稍后。
                <br />
                <em class="icon-info red"></em>&nbsp;
                <span th:text="${footYqts}">123</span>
            </div>
        </div>
        <div class="hidden-480" style="text-align:center; background-color:#000;height:100%;width:100%;position:absolute;z-index:1;">
            <div class="hidden-480" id="flashdiv"></div>
        </div>
    </div>
    <div class="login_middle">
        <div class="container-fluid">
            <div>
                <div class="row-fluid">
                    <div class="span12">
                        <div class="login-container">
                            <div class="row-fluid">
                                <div class="center">
                                    <h1><img th:src="@{/images/logo2.png}" src="" alt="" /><span class="blue" th:text="${session.title}">123</span></h1>
                                    <h4 class="green" th:text="${'&copy;' + session.title}">&copy; 123</h4>
                                </div>
                            </div>
                            <div class="space-6"></div>
                            <form th:object="${footUser}" method="post" th:action="@{/login}" name="form">
                                <div class="row-fluid">
                                    <div class="position-relative">
                                        <div id="login-box" class="visible widget-box no-border">
                                            <div class="widget-body">
                                                <div class="widget-main">
                                                    <h4 class="header blue lighter bigger"> <em class="icon-coffee green"></em> 请输入您的登录信息 </h4>
                                                    <div class="space-6"></div>
                                                    <fieldset>
                                                        <label> <span class="block input-icon input-icon-right"> <input type="text" name="name" id="name" class="span12" placeholder="用户名" /><em class="icon-user"></em> </span> <span style="color:red" th:if="${#fields.hasErrors('name')}" th:errors="*{name}">Name Error</span> </label>
                                                        <label> <span class="block input-icon input-icon-right"> <input type="password" name="password" id="password" class="span12" placeholder="密码" /> <em class="icon-lock"></em> </span> <span style="color:red" th:if="${#fields.hasErrors('password')}" th:errors="*{password}">Password Error</span> </label>
                                                        <label> <span class="block input-icon input-icon-right"> <input type="text" name="yzm" class="span9" placeholder="验证码" /> <img alt="看不清楚，换一张" id="yzmImage" src="" th:onclick="'javascript:reloadVerifyCode(this)'" style="cursor: hand;" /> </span> <span style="color:red" th:if="${#fields.hasErrors('yzm')}" th:errors="*{yzm}">Password Error</span> </label>
                                                        <div class="space"></div>
                                                        <div class="row-fluid">
                                                            <label class="span8"> <input name="rememberme" id="rememberme" type="checkbox" value="1" /> <span class="lbl" style="color:#ccc">记住帐号密码</span> </label>
                                                            <button type="button" id="login_btn" class="span4 btn btn-small btn-primary" onclick="delay();return false;"> <em class="icon-key"></em>登陆</button>
                                                        </div>
                                                    </fieldset>
                                                </div>
                                                <!--/widget-main-->
                                                <div class="toolbar clearfix">
                                                    <div>
                                                        <a th:href="@{/forgetpwd}" class="forgot-password-link"> <em class="icon-arrow-left"></em>忘记密码？ </a>
                                                    </div>
                                                    <div>
                                                        <a th:href="@{/regist}" class="user-signup-link"> 我要注册<em class="icon-arrow-right"></em> </a>
                                                    </div>
                                                </div>
                                                <div class="clearfix">
                                                    <div>
                                                        <p>&nbsp;</p>
                                                        <p style="text-align: center;">推荐使用 IE8以上版本和谷歌浏览器</p>
                                                        <p style="text-align: center;">QQ群：1853619</p>
                                                        <p style="text-align: center;">鲁ICP备14024795号-1</p>
                                                    </div>
                                                </div>
                                            </div>
                                            <!--/widget-body-->
                                        </div>
                                        <!--/login-box-->
                                    </div>
                                    <!--/position-relative-->
                                </div>
                            </form>
                        </div>
                    </div>
                    <!--/span-->
                </div>
                <!--/row-->
            </div>
        </div>
        <!--/.fluid-container-->
    </div>
</div>
<!--basic scripts-->
<script th:src="@{/js/placeholder_plus.js}"></script>
<script type="text/javascript">
    var params= {
        "allowscriptaccess": "never",
        "quality": "high",
        "wmode": "transparent",
        "allowfullscreen": "never"
    };
    function delay(){
        window.setTimeout(function(){
            //$("#gif").show();
            document.form.submit();
        },7000);
    }
    $(document).ready(function(){
        $("#login_btn").click(function(){
            $(".login_middle").hide();
            $(".login_message").fadeIn(4000).delay(6000).fadeOut(4000);
        });
        $('input[placeholder]').placeholder();//placeholder IE9以下补丁
    });
</script>
</body>
</html>